<!DOCTYPE html>

<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
  <meta charset="utf-8" />
  <!-- Set the viewport width to device width for mobile -->
  <meta name="viewport" content="width=device-width" />
  <meta name="renderer" content="webkit" />
  <title>用户管理</title>

<style>
.order{
  background-color: #F1F1F1;
  padding: 3px;
  margin: 2px;
}
</style>

</head>
<body>

<table>
  {% for manager in handler.managers %}
  <tr>
    <td>{{ manager["id"] }}</td>
    <td>{{ manager.get("name", "未知") }}</td>
    <td><button>删除</button></td>
  </tr>
  {% end for %}
</table>
<br>
<br>

<select id="community">
  {% for community in handler.communities %}
  <option value="{{ community['id'] }}" selected>{{ community['name'] }}</option>
  {% end for %}
</select>
<button id="new_community">添加新小区</button>
<br>
<br>

<button id="new_invitation">邀请新管理员</button><br>
{% for invitation in handler.invitations %}
<i>{{ "%s://%s/invitation_accept?manager_id=%s" % (request.protocol, request.host, invitation["id"]) }}</i><br>
{% end for %}

</body>
<script type="text/javascript" src="/static/js/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
// function show_order(order){
//   if($("#"+order["order_id"]).length == 0){
//     $("body").prepend("<div class='order' id='"+order["order_id"]+"'></div>");
//   }
//   html  = "<select id='status'>";
//   html += "<option value='0'>等待确认</option>";
//   html += "<option value='1'>确认罩车</option>";
//   html += "<option value='2'>罩车完成</option>";
//   html += "<option value='3'>确认摘车罩</option>";
//   html += "<option value='4'>车罩已摘</option>";
//   html += "<option value='5'>车主自己摘车罩</option>";
//   html += "</select> ";
//   html += order["menu"]+" "+order["add"]+" <a href='tel:"+order["tel"]+"'>"+order["tel"]+"</a>";
//   $("#"+order["order_id"]).html(html);
//   $("#"+order["order_id"]+" #status").val(order["status"]).change(function(evt){
//     $.post("/api/order/dashboard_change", {
//       "order_id": order["order_id"],
//       "status": evt.target.value,
//     });
//   });
// }
//
$(function(){
  $("#new_community").click(function(evt){
    name = prompt("请输入小区名称");
    alert(name);
  });

  $("#new_invitation").click(function(evt){
    community_id = $("#community").val();
    console.log(community_id);
    $.post("/api/invite", {"community_id": community_id, "level": "0"}, function(){
      window.location.reload();
    });
  });
});
</script>

</html>
